<!--
 * @Author: 曹文丽 caowenli@yuan-info.com
 * @Date: 2023-09-18 10:34:41
 * @LastEditors: 曹文丽 caowenli@yuan-info.com
 * @LastEditTime: 2023-09-18 16:39:37
 * @FilePath: \yuan-asset-module-browser\src\views\riskDetection\riskIdentification\addTask.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="yaBox">
    <yaEditForm
      :formColumns="formColumns"
      v-model="formData"
      @submit="handlerToSubmit"
      :loading="isLoading"
    >
      <!-- 执行方式 -->
      <template #carryOutType="{ data }">
        <div style="width: 100%">
          <AddPopUp
            v-if="data.type && data.type != 'manual'"
            ref="refAddPopUp"
            :showType="1"
            :isShow="data.type"
            @dateValue="getModelValue"
            :dataValue="timeObj"
          />
        </div>
      </template>
      <!-- 目标地址的导入 -->
      <template #yaTargetAddress>
        <yaInputUpload
          :pass="['txt']"
          @handleChangeUpload="handleImport"
          @handleDeleteFile="handleDelete"
        ></yaInputUpload>
        <span class="ya-config" @click="handleDownloadTemplate">模板下载</span>
      </template>
      <!-- 口令猜测 -->
      <template #weakGuess="{ data }">
        <el-checkbox v-model="data.weakPassEnable">启用</el-checkbox>
        <span
          class="ya-config"
          v-if="data.weakPassEnable"
          @click="handlerToOtherPage()"
          >详细配置</span
        >
      </template>
      <!-- 仅生成扫描报告 -->
      <template #generateReport="{ data }">
        <el-checkbox v-model="data.generateReportEnable">启用</el-checkbox>
      </template>
      <!-- 登录检查 -->
      <template #loginCheck="{ data }">
        <el-checkbox v-model="data.loginCheckEnable">启用</el-checkbox>
      </template>
      <!-- 登陆配置 -->
      <template #loginCheckTable="{ data }">
        <template v-if="data.loginCheckEnable">
          <div class="ya-buttons">
            <ya-button @click="handleToExport">导出</ya-button>
            <div class="ya-right-buttons">
              <ya-button @click="uploadProps.showDrawer = true">导入</ya-button>
              <ya-button type="primary" @click="handlerToOtherPage()"
                >添加</ya-button
              >
            </div>
          </div>
          <ya-table
            @btnClick="handleTableBtnClick"
            :data="data.loginCheckConfigConfigList"
            :column="column"
          ></ya-table>
        </template>
      </template>
    </yaEditForm>
    <yaDrawerUpload
      v-if="uploadProps.showDrawer"
      templateUrl="xxx.xlsx"
      :http="http"
      :drawerProps="uploadProps"
      @submit="uploadSubmit"
      @handleChangeUpload="handleChangeUpload"
    ></yaDrawerUpload>
  </div>
</template>
<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { hostScanColumn, column } from './hostScan';
import AddPopUp from './components/addPopUp.vue';
import { http } from '@/utils/https';
import { downLoadFile } from '../../../../utils/utils';
const formColumns = ref([]);
const formData = ref({
  weakPassEnable: false,
  loginCheckEnable: true,
  scanDepth: 3,
  plugTimeout: 30,
  socketTimeout: 5,
  opensshRemoteEnable: false,
  ntpRemoteEnable: false,
});
let isLoading = ref(false);
//执行方式的时间选择
const timeObj = ref({
  type: '',
  startTime: '',
  executeTime: '',
  typeParam: '',
});

//目标地址的导入
const handleImport = (file) => {
  let fd = new FormData();
  fd.append('file', file.raw);
};
//目标地址的删除
const handleDelete = () => {};
//下载目标地址的导入模板
const handleDownloadTemplate = () => {};
// 登陆配置--start
//导入抽屉
const uploadProps = reactive({
  title: '导入',
  showDrawer: false,
});
//导入的校验
const handleChangeUpload = (uploadFile, resolve) => {
  let fd = new FormData();
  fd.append('file', uploadFile.raw);
  resolve({
    importStatus: true, // importStatus: Boolean; true: 导入成功, 为true时failInfoList为空; false: 导入失败;
    message: '成功', // 文件校验是否通过 param --> message: 提示信息
    failInfoList: [],
  });
};
//导入抽屉的确定按钮事件
const uploadSubmit = (file) => {
  let fd = new FormData();
  fd.append('file', file.raw);
  console.log('重新刷新列表数据');
};
// 登陆配置的导出
const handleToExport = () => {
  // downLoadFile(res, '登录检查IP信息导出');
};

//登陆配置的table的按钮的点击事件
const handleTableBtnClick = () => {};
//登陆配置--end
/**
 * @description: 获取组件传参
 */
const getModelValue = (e) => {
  if (timeObj.value.type == 'custom_point') {
    timeObj.value.startTime = e.time;
  } else {
    timeObj.value.executeTime = e.time;
  }
  if (e.allWeek) {
    timeObj.value.typeParam = e.allWeek + ',' + e.weekDay;
  } else {
    timeObj.value.typeParam = e.weekDay;
  }
};
//详情配置的跳转事件
const handlerToOtherPage = () => {};
const handlerToSubmit = (data) => {};
onMounted(() => {
  formColumns.value = hostScanColumn;
});
</script>
<style scoped lang="scss">
.yaBox {
  ::v-deep .ya-form-title {
    width: calc(100% + 75px);
    font-weight: 500;
    color: rgba(0, 0, 0, 0.8);
    position: relative;
    padding-left: 8px;
    padding-bottom: 16px;
    padding-top: 0px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    &::before {
      content: '';
      display: block;
      width: 3px;
      height: 14px;
      background: var(--el-color-primary);
      position: absolute;
      left: 0;
      top: -1px;
    }
  }

  ::v-deep .add-form {
    max-width: calc((100% - 56px) / 2);
    .el-input {
      width: 100%;
    }
  }
  ::v-deep .yaInputUp {
    max-width: calc((100% - 196px) / 2);
  }
  .ya-config {
    color: #0095ff;
    text-decoration: underline;
    cursor: pointer;
    margin-left: 16px;
  }
  .ya-buttons {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
  }
  ::v-deep .ya-table-content {
    width: 100%;
  }
}
</style>
